<!DOCTYPE html>
<html xmlns:th="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
    <!--<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests" />-->
    <title>文件上传</title>
    <link rel="stylesheet" href="./layui/css/layui.css">

    <script src="./layui/layui.js"></script>
    <script>
        //一般直接写在一个js文件中
        layui.use( ['form', 'layedit', 'laydate','upload'], function(){
            var $ = layui.jquery
                ,layer = layui.layer
                ,upload = layui.upload

            upload.render({
                elem: '#uploadFile',
                url: '/upload',
                accept: 'file',
                exts: 'doc|docx|pdf',
                data: {uid:  $("#uid").val()},
                done: function(res){
                    console.log("+++result: ", res.result);
                    if(res.result){
                        layer.msg('上传成功');
                        //$("#name").val(res.name);
                    } //上传成功
                }
                ,error: function(){
                    //演示失败状态，并实现重传
                    var demoText = $('#demoText');
                    demoText.html('<span style="color: #FF5722;">上传失败</span> <a class="layui-btn layui-btn-mini demo-reload">重试</a>');
                    demoText.find('.demo-reload').on('click', function (uploadInst){
                        uploadInst.upload();
                    });
                }
            });
        });
    </script>
</head>
<body>

<!-- 你的HTML代码 -->
<div class="layui-upload-drag layui-col-xs12 layui-col-xs-offset9" id="uploadFile" style="margin:0 auto;">
    <i class="layui-icon">&#xe67c;</i>
    <p>点击上传，或将文件拖拽到此处</p>
</div>

<fieldset class="layui-elem-field layui-field-title" style="margin-top: 30px;">
    <legend>小提示：</legend>
</fieldset>
<input id="uid" type="hidden" name="uid" th:value="${uid}" />
<blockquote class="layui-elem-quote">
    1 上传文件类型：pdf，word文档；<br/>
    2 系统云盘只能保存有限文件，请上传后自行删除；<br/>
    3 系统上传进行加密处理，可放心使用。
</blockquote>
</body>
</html>